<template>
  <div class="footer-page">
    <div>
      <span
        >共 <strong>{{ this.countNum }}</strong> 条</span
      >
      |
      <span
        >每页 <strong>20</strong> 条 |
        <span
          >共 <strong>{{ this.maxPage }}</strong> 页</span
        ></span
      >
    </div>
    <el-pagination
      background
      :total="countNum"
      :current-page.sync="nowPage"
      layout="prev, pager, next, jumper"
      @current-change="changePage"
      :page-size="20"
    >
    </el-pagination>
  </div>
</template>
<script>
import { mixins } from "../../mixin/page";

export default {
  name: "pageFtoor",
  components: {},
  mixins: [mixins],

  data() {
    return {};
  },
  methods: {
    changePage(num) {
      console.log(num);
      this.$emit("changePage", num);
    },
  },
  computed: {},
  watch: {},
};
</script>
<style lang="less" scoped>
.footer-page {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  span {
    font-size: 12px;
    strong {
      font-size: 14px;
    }
  }
}
.el-pagination {
  display: flex;
  justify-content: flex-end;
}
</style>
